import 'package:flutter/material.dart';
import 'package:flutter_massage/common_lib/extension/ex_widget.dart';
import 'package:flutter_massage/common_lib/index.dart';
import 'package:flutter_massage/common_lib/ui/common_component.dart';
import 'package:flutter_massage/generated/assets.dart';
import 'package:flutter_massage/pages/home/home_component.dart';
import 'package:flutter_massage/pages/model/bean.dart';
import 'package:flutter_massage/pages/preject/project_logic.dart';
import 'package:flutter_massage/values/colors.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';
import 'package:get/get.dart';

class ProjectPage extends GetView<ProjectLogic> {
  const ProjectPage({super.key});

  @override
  Widget build(BuildContext context) {
    return BaseScaffold(
      titleStr: '项目',
      scaffoldBackgroundColor: AppColors.grayF8,
      child: GetBuilder<ProjectLogic>(
        init: ProjectLogic(),
        assignId: true,
        builder: (logic) {
          return ListView.separated(
            padding: EdgeInsets.all(12.w),
            itemCount: logic.projectList.length,
            separatorBuilder: (BuildContext context, int index) => CommonMargin.height(12.w),
            itemBuilder: (BuildContext context, int index) {
              ProjectBean bean = logic.projectList[index];
              return HomeRecommendProject(
                bean,
                rightWidget: _buildItemRight(bean),
                bottomWidget: _buildBottom(bean),
              );
            },
          );
        },
      ),
    );
  }

  Widget _buildItemRight(ProjectBean bean) {
    return Column(
      crossAxisAlignment: CrossAxisAlignment.start,
      children: [
        Row(
          children: [
            TextWidget.oneLine(
              text: bean.itemName ?? '',
              fontSize: 15,
              color: AppColors.textLevelOne,
              fontWeight: FontWeight.bold,
            ).expanded(),
            TextWidget.oneLine(
              text: '超${bean.chooseNum}选择',
              fontSize: 10,
              color: AppColors.textLevelTwo,
              fontWeight: FontWeight.bold,
            ),
          ],
        ).paddingTop(6.w),
        TextWidget.moreLine(
          text: bean.itemLabel ?? '',
          fontSize: 12,
          fontWeight: FontWeight.bold,
          color: AppColors.textLevelTwo,
        ).paddingTop(4.w),
        const Spacer(),
        Row(
          children: [
            ButtonWidget.iconText(
              Assets.svgIconDuration.toSvg(width: 12.w),
              bean.itemTime ?? '',
              textColor: AppColors.textLevelTwo,
              fontSize: 12,
            ).expanded(),
            TextWidget.oneLine(
              text: '￥${bean.itemOldPrice.removeYuan()}',
              fontSize: 12,
              color: AppColors.textLevelTwo,
              style: const TextStyle(decoration: TextDecoration.lineThrough),
            ).paddingRight(8.w),
            Text.rich(
              TextSpan(
                text: '¥',
                children: [
                  TextSpan(
                    text: bean.itemPrice.removeYuan(),
                    style: const TextStyle(
                      fontSize: 17,
                      color: AppColors.primaryOrange,
                      fontWeight: FontWeight.bold,
                    ),
                  ),
                ],
                style: const TextStyle(
                  fontSize: 12,
                  color: AppColors.primaryOrange,
                  fontWeight: FontWeight.bold,
                ),
              ),
            ),
          ],
        ).paddingBottom(2.w),
      ],
    );
  }

  Widget _buildBottom(ProjectBean bean) {
    List<TechnicianBean> result = (bean.itemTechnicians ?? []).take(5).toList();
    List<String> iconList = result.map((e) => e.header ?? '').toList();
    List<Widget> icons = iconList
        .map((e) => Padding(
              padding: EdgeInsets.only(left: iconList.indexOf(e) * 25.w),
              child: ImageWidget.url(
                e,
                width: 30.w,
                height: 30.w,
                radius: 30.w,
                borderWidth: 1,
                borderColor: AppColors.white,
              ),
            ))
        .toList();
    icons.add(Padding(
      padding: EdgeInsets.only(left: icons.length * 25.w),
      child: Container(
        width: 30.w,
        height: 30.w,
        decoration: CommonDecoration.getShapeDecoration(
          borderColor: AppColors.white,
          borderWidth: 1,
          radius: 30.w,
          bg: '#F2F2F2'.toColor,
        ),
        alignment: Alignment.center,
        child: const Icon(Icons.more_horiz, color: AppColors.grayD8),
      ),
    ));
    return Row(
      children: [
        Text.rich(
          TextSpan(
            text: '附近有',
            children: [
              TextSpan(
                text: (bean.nearTechnicianNum ?? 0).toString(),
                style: const TextStyle(color: AppColors.primaryGreen),
              ),
              const TextSpan(text: '位技师可为您服务'),
            ],
            style: const TextStyle(
              fontSize: 12,
              color: AppColors.textLevelTwo,
              fontWeight: FontWeight.bold,
            ),
          ),
        ).expanded(),
        Stack(children: icons.reversed.toList()),
      ],
    ).padding(top: 12.w, bottom: 5.w);
  }
}
